 <html>
 <head>
 <title>multiChoice</title>
 <style type="text/css">
	.multiple-choice-question-fields li a .multiple-choice-radio {
		background: url("../images/radio-button.png") repeat scroll 0 0 transparent;
		display: block;
		float: left;
		height: 29px;
		line-height: 29px;
		margin-right: 5px;
		width: 29px;
	}
	ul{
		padding:0;
	}
	ul li {
		list-style-type: none;
		text-decoration: none;
	}

	.question-number {
		float: left;
		margin-right: 10px;
	}
		
	.multiple-choice-question-fields li {
		display: inline-block;
		width: 200px;
	}

	.multiple-choice-question-fields {
		float: left;
		margin: 10px;
		width: 440px;
}
 </style>
 </head>
 <body>
 
<ul id="multiple-choice-questions" >
	<li id="multiple-choice-question-1" class="multiple-choice-question  altrow">
		<div id="multiple-choice-question-1-score"  class='incorrect'></div>
		<div class="question-number"><div id="dictation-question-1-score"></div>1)</div>
		<div class="question-text">There's too much information here. Please just tell me what it all </div>
		<div class="multiple-choice-question-fields">
			<ul>
				<li>
					<input id="" type="hidden" value=""></input>
					<a href="javascript:;" class="selected"><span class="multiple-choice-radio"></span>A:field value</a>
				</li>
				<li>
					<input id="" type="hidden" value=""></input>
					<a href="javascript:;" class="selected"><span class="multiple-choice-radio"></span>B:field value</a>
				</li>
				<li>
					<input id="" type="hidden" value=""></input>
					<a href="javascript:;" class="selected"><span class="multiple-choice-radio"></span>C:field value</a>
				</li>
				<li>
					<input id="" type="hidden" value=""></input>
					<a href="javascript:;" class="selected"><span class="multiple-choice-radio"></span>D:field value</a>
				</li>
			</ul>
		</div>
	</li>
</ul>
 
 </body>
 </html>
			
